<template>
  <div class="span16">
    <ul class="home-promo-list clearfix">
      <li v-for="i in 3" :key="i">
        <a href="https://www.mi.com/buy/detail?product_id=10000204">
          <img src="../../../assets/imgs/bottomIMG.jpg" alt="" />
        </a>
      </li>
    </ul>
  </div>
</template>

<script>
export default {};
</script>

<style scoped>
.span16{
  width: 978px
}
.home-promo-list li:first-child {
  margin-left: 0;
}
.home-promo-list {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.home-promo-list li {
  float: left;
  width: 316px;
  height: 170px;
  margin-left: 15px;
  -webkit-transition: -webkit-box-shadow 0.2s linear;
  transition: -webkit-box-shadow 0.2s linear;
  transition: box-shadow 0.2s linear;
  transition: box-shadow 0.2s linear, -webkit-box-shadow 0.2s linear;
}
.home-promo-list img {
  display: block;
  width: 316px;
  height: 170px;
}
.home-promo-list a {
  display: block;
  height: 170px;
}
</style>